<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('编辑实验报告管理')"/>
    <th:block th:include="include :: datetimepicker-css"/>
    <th:block th:include="include :: summernote-css"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-report-add" th:object="${experimentReport}" enctype="multipart/form-data">
        <input name="reportId" th:field="*{reportId}" type="hidden">
        <input name="classProjectId" th:value="${experimentClassProject.classProjectId}" type="hidden">

        <div class="col-xs-12">
            <div class="form-group">
                <label class="col-sm-3 control-label">报告标题：</label>
                <div class="col-sm-8">
                    <input name="reportTitle" th:field="*{reportTitle}" class="form-control" type="text">
                </div>
            </div>
        </div>

        <div class="col-xs-15">
            <div class="form-group">
                <label class="col-sm-3 control-label">报告内容：</label>
                <div class="col-sm-8">
                    <input type="hidden" class="form-control" th:field="*{reportContent}" name="reportContent">
                </div>
            </div>
        </div>

        <div class="col-xs-15">
            <div class="form-group">
                <div class="ry-card-title"><h4><b>一、预习内容</b></h4></div>
                <div class="ry-card-title">1、实验目的和要求</div>
                <div class="col-sm-12">
                    <input type="hidden" class="form-control" th:field="*{experimentPurposeDemand}" name="experimentPurposeDemand">
                </div>

                <div class="ry-card-title">2、实验原理（算法思想、实验内容及方法等）</div>
                <div class="col-sm-12">
                    <input type="hidden" class="form-control" th:field="*{experimentPrinciple}" name="experimentPrinciple">
                </div>

                <div class="ry-card-title">3、实验设备（硬件和软件环境）</div>
                <div class="col-sm-12">
                    <input type="hidden" class="form-control" th:field="*{experimentEquipment}" name="experimentEquipment">
                </div>
            </div>
        </div>

        <div class="col-xs-15">
            <div class="form-group">
                <div class="ry-card-title"><h4><b>二、实验过程</b></h4></div>
                <div class="ry-card-title">（源程序及注释或操作步骤）</div>
                <div class="col-sm-12">
                    <input type="hidden" class="form-control" th:field="*{experimentProcedure}" name="experimentProcedure">
                </div>
            </div>
        </div>

        <div class="col-xs-15">
            <div class="form-group">
                <div class="ry-card-title"><h4><b>三、实验结果与分析</b></h4></div>
                <div class="ry-card-title">（对程序输出或实验结果进行分析：与预期输出结果不同时，分析原因。）</div>
                <div class="col-sm-12">
                    <input type="hidden" class="form-control" th:field="*{experimentResultAnalysis}" name="experimentResultAnalysis">
                </div>
            </div>
        </div>
    </form>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: datetimepicker-js"/>
<th:block th:include="include :: summernote-js"/>
<script th:inline="javascript">
    var prefix = ctx + "college/report"

    $("#form-report-add").validate({
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            // 处理文件上传表单提交
            var formData = new FormData($('#form-report-add')[0]);
            $.ajax({
                url: prefix + "/edit",  // 注意修改为编辑接口
                type: "post",
                data: formData,
                cache: false,
                contentType: false,
                processData: false,
                dataType: "json",
                success: function(result) {
                    if (result.code == web_status.SUCCESS) {
                        $.modal.msgSuccess("操作成功");
                        $.operate.closeCurrentTab();
                    } else {
                        $.modal.msgError(result.msg);
                    }
                }
            });
        }
    }

    $("input[name='submitTime']").datetimepicker({
        format: "yyyy-mm-dd",
        minView: "month",
        autoclose: true
    });

    $(function() {
        // 初始化富文本编辑器并回显内容
        var reportContent = $("input[name='reportContent']").val();
        var experimentPurposeDemand = $("input[name='experimentPurposeDemand']").val();
        var experimentPrinciple = $("input[name='experimentPrinciple']").val();
        var experimentEquipment = $("input[name='experimentEquipment']").val();
        var experimentProcedure = $("input[name='experimentProcedure']").val();
        var experimentResultAnalysis = $("input[name='experimentResultAnalysis']").val();
        // $('.summernote').summernote({
        //     lang: 'zh-CN',
        //     dialogsInBody: true,
        //     height: 500,
        //     placeholder:'请输入内容',
        //     callbacks: {
        //         onChange: function(contents, $edittable) {
        //             $("input[name='" + this.id + "']").val(contents);
        //         },
        //         onImageUpload: function(files) {
        //             var obj = this;
        //             var data = new FormData();
        //             data.append("file", files[0]);
        //             $.ajax({
        //                 type: "post",
        //                 url: ctx + "common/upload",
        //                 data: data,
        //                 cache: false,
        //                 contentType: false,
        //                 processData: false,
        //                 dataType: 'json',
        //                 success: function(result) {
        //                     if (result.code == web_status.SUCCESS) {
        //                         $('#' + obj.id).summernote('insertImage', result.url);
        //                     } else {
        //                         $.modal.alertError(result.msg);
        //                     }
        //                 },
        //                 error: function(error) {
        //                     $.modal.alertWarning("图片上传失败。");
        //                 }
        //             });
        //         }
        //     }
        // });
        // 设置富文本编辑器内容
        if (reportContent) {
            $('#reportContent').summernote('code', reportContent);
        }

        if(experimentPurposeDemand){
            $('#experimentPurposeDemand').summernote('code', experimentPurposeDemand);
        }

        if(experimentPrinciple){
            $('#experimentPrinciple').summernote('code', experimentPrinciple);
        }

        if(experimentEquipment){
            $('#experimentEquipment').summernote('code', experimentEquipment);
        }

        if(experimentProcedure){
            $('#experimentProcedure').summernote('code', experimentProcedure);
        }

        if(experimentResultAnalysis){
            $('#experimentResultAnalysis').summernote('code', experimentResultAnalysis);
        }
        //
        // // 初始化文件信息显示
        // var filePath = $("#filePath").val();
        // if (filePath) {
        //     // 可以在这里通过文件名解析逻辑获取文件名
        //     var fileName = $("#fileName").text();
        //     $("#fileInfo").html('<i class="fa fa-check text-success"></i> 已上传：' + fileName);
        // }
    });

    // 文件上传处理函数
    // function uploadFile() {
    //     var file = document.getElementById("fileUpload").files[0];
    //     handleFileUpload(file);
    // }

    // // 重新上传处理函数
    // function reuploadFile() {
    //     var file = document.getElementById("reuploadFile").files[0];
    //     handleFileUpload(file);
    // }

    // 通用文件上传处理
    // function handleFileUpload(file) {
    //     if (!file) {
    //         $.modal.alertWarning("请先选择文件");
    //         return;
    //     }
    //
    //     // 验证文件大小（限制50MB）
    //     if (file.size > 50 * 1024 * 1024) {
    //         $.modal.alertWarning("文件大小不能超过50MB");
    //         return;
    //     }
    //
    //     var formData = new FormData();
    //     formData.append("file", file);
    //
    //     $.ajax({
    //         type: "post",
    //         url: ctx + "common/upload",
    //         data: formData,
    //         cache: false,
    //         contentType: false,
    //         processData: false,
    //         dataType: 'json',
    //         beforeSend: function() {
    //             $("#fileInfo").html('<i class="fa fa-spinner fa-spin"></i> 正在上传...');
    //         },
    //         success: function(result) {
    //             if (result.code == web_status.SUCCESS) {
    //                 $("#filePath").val(result.url);
    //                 $("#fileInfo").html('<i class="fa fa-check text-success"></i> 上传成功：' + file.name);
    //                 // 如果是重新上传，隐藏重新上传控件，显示新的文件信息
    //                 if ($("#reuploadContainer").is(":visible")) {
    //                     $("#reuploadContainer").hide();
    //                     $(".well").remove();
    //                     $("#fileInfo").after('<div class="well well-sm" style="margin-bottom: 10px;"><div class="row"><div class="col-sm-8"><i class="fa fa-file-o text-primary"></i><span>'+file.name+'</span></div><div class="col-sm-4 text-right"><a href="'+result.url+'" target="_blank" class="btn btn-xs btn-info"><i class="fa fa-download"></i> 下载</a><button type="button" class="btn btn-xs btn-danger" onclick="resetFileUpload()"><i class="fa fa-refresh"></i> 重新上传</button></div></div></div>');
    //                 }
    //             } else {
    //                 $("#fileInfo").html('<i class="fa fa-times text-danger"></i> 上传失败：' + result.msg);
    //             }
    //         },
    //         error: function() {
    //             $("#fileInfo").html('<i class="fa fa-times text-danger"></i> 上传失败，请重试');
    //         }
    //     });
    // }

    // 显示选中的文件名
    // document.getElementById("fileUpload").addEventListener("change", function() {
    //     if (this.files.length > 0) {
    //         $("#fileInfo").html("选中文件：" + this.files[0].name);
    //     }
    // });

    // 重新上传文件选择事件
    // document.getElementById("reuploadFile").addEventListener("change", function() {
    //     if (this.files.length > 0) {
    //         $("#fileInfo").html("选中文件：" + this.files[0].name);
    //     }
    // });
    //
    // // 重置为上传状态
    // function resetFileUpload() {
    //     $(".well").hide();
    //     $("#reuploadContainer").show();
    //     $("#fileInfo").html("支持格式：doc, docx, pdf, zip, rar, txt");
    // }
</script>
</body>
</html>